//行对齐
.t-a-l {
  text-align: left;
}
.t-a-r {
  text-align: right;
}
.t-a-c {
  text-align: center;
}
// 基线对齐
.v-a-m {
  vertical-align: middle;
}
.v-a-t {
  vertical-align: top;
}
.kw {
  width: 100%;
}
.b-b-1 {
  border-bottom: 1px solid #ccc;
}
.b-t-1 {
  border-top: 1px solid #ccc;
}
// 字体颜色
.c-white {
  color: #fff !important;
}
.c-block {
  color: #000;
}
.c-blue {
  color: cyan;
}
.c-blue1 {
  color: rgb(52, 134, 249);
}
.c-hui {
  color: #777;
}
.c-o {
  color: #fc6e24;
}
// 背景颜色
.b-white {
  background: #fff;
}
.b-hui {
  background: #f3f3f3;
}
.b-red {
  background: red;
}
.b-blue {
  background: rgb(52, 134, 249);
}
// 行标签
.dis-in {
  display: inline-block;
}
// 左浮动
.f-l {
  float: left;
}
.f-r {
  float: right;
}
.mw {
  margin: 0 !important;
}
.m-t {
  margin-top: 46px;
}

//循环生成类名
@for $i from 1 through 100 {
  .f-s-#{$i} {
    font-size: $i + px;
  }
}
@for $i from 1 through 100 {
  //左边距
  .m-l-#{$i} {
    margin-left: $i + vw;
  }
  //右边距
  .m-r-#{$i} {
    margin-right: $i + vw;
  }
  //上边距
  .m-t-#{$i} {
    margin-top: $i + vh;
  }
  //下边距
  .m-b-#{$i} {
    margin-bottom: $i + vh;
  }
  //左边距
  .p-l-#{$i} {
    padding-left: $i + vw;
  }
  //右边距
  .p-r-#{$i} {
    padding-right: $i + vw;
  }
  //上边距
  .p-t-#{$i} {
    padding-top: $i + vh;
  }
  //下边距
  .p-b-#{$i} {
    padding-bottom: $i + vh;
  }
}
